import React from 'react'

const Button = ({children}, context) => (
  <button style={{background: context.color}}>{children}</button>
)

//class Button extends React.Component {
//  render() {
//	  return <button style={{background: this.context.color}}>{this.props.children}</button>
//	}
//}

Button.contextTypes = {color: String}

class MessageList extends React.Component {
  getChildContext() {
	  return {color: 'purple'}
	}
	render() {
	  return (
		  <div>
			  to show context usage
				{[1,2,3].map(num => <Button key={num}>{num}</Button>)}
			</div>
		)
	}
}
MessageList.childContextTypes = {
	  color: String
}

export default MessageList
